<template>
    <view class="content">
        <view class="list_inner" @click="goto(`/pagesSub-My/my/messageList?type=1`)">
            <view class="list_left">
                <uni-badge size="small" :text="info[0].noReadCount" absolute="rightTop" type="error">
                    <image src="../static/images/icon_huo@2x.png"></image>
                </uni-badge>
                <view class="info">活动消息</view>
            </view>
            <view style="display: flex;">
                <view class="time gray_font" v-if="info[0].sendTime">{{info[0].sendTime}}</view>
                <!-- <view class="time gray_font" v-else>暂无信息</view> -->
                <view style="position: relative;">
                    <image style="position: absolute;top:20rpx;right: 5rpx;" class="right_icon" src="../static/images/icon_gary_ic.png"></image>
                </view>
            </view>
        </view>

        <view class="list_inner" @click="goto(`/pagesSub-My/my/messageList?type=3`)">
            <view class="list_left">
                <uni-badge size="small" :text="info[2].noReadCount" absolute="rightTop" type="error">
                    <image src="../static/images/icon_ding@2x.png"></image>
                </uni-badge>
                <view class="info">订单信息</view>
            </view>
            <view style="display: flex;">
                <view class="time gray_font" v-if="info[2].sendTime">{{info[2].sendTime}}</view>
                <!-- <view class="time gray_font" v-else>暂无信息</view> -->
                <view style="position: relative;">
                    <image style="position: absolute;top:20rpx;right: 5rpx;" class="right_icon" src="../static/images/icon_gary_ic.png"></image>
                </view>
            </view>
        </view>
        <view class="list_inner" @click="goto(`/pagesSub-My/my/messageList?type=4`)">
            <view class="list_left">
                <uni-badge size="small" :text="info[3].noReadCount" absolute="rightTop" type="error">
                    <image src="../static/images/icon_xi@2x.png"></image>
                </uni-badge>
                <view class="info">系统信息</view>
            </view>
            <view style="display: flex;">
                <view class="time gray_font" v-if="info[3].sendTime">{{info[3].sendTime}}</view>
                <!-- <view class="time gray_font" v-else>暂无信息</view> -->
                <view style="position: relative;">
                    <image style="position: absolute;top:20rpx;right: 5rpx;" class="right_icon" src="../static/images/icon_gary_ic.png"></image>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    import { noRead } from '@/api/my.js';
    export default {
        data() {
            return {
                info:{}
            }
        },
        onShow:function() {
            this.centerList();
        },
        methods: {
            goto(url) {
                uni.navigateTo({
                    url:url
                })
            },
            centerList(){
                let _this = this;
                uni.showLoading({
                    title:'加载中'
                });
                noRead().then(res => {
                    _this.info=res.data;
                    uni.hideLoading();
                }).catch(res => {
                    uni.hideLoading()
                });
            },

        }
    }
</script>

<style scoped>
    .list_inner{
        background-color: #FFFFFF;
        padding: 20rpx 30rpx;
        display: flex;
        justify-content: space-between;
        border-bottom: 1rpx solid #F9F9F9;
    }
    .list_left{
        display: flex;
    }
    .list_left image{
        width: 70rpx;
        height: 70rpx;
    }
    .list_left>.info{
        font-size: 30rpx;
        margin-left: 30rpx;
        line-height: 70rpx;
    }
    .time{
        font-size: 27rpx;
        line-height: 70rpx;
        margin-right: 40rpx;
    }
    .right_icon{
        width: 30rpx;
        height: 25rpx;
    }
</style>
